<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/4.1.0/immutable.min.js"></script>
  <script>

    const im = Immutable;
    
/*     
    //Map的使用
    const info = {
      name: "zhangsan",
      age: 30,
      friend: {
        name: "lisi",
        age: 35
      }
    } 
    const infoIM = im.Map(info)
    const obj = infoIM;
    const newInfoIM = infoIM.set("name", "lisense")
    console.log(obj.get("name"));
    console.log(newInfoIM.get("name"));
*/

/*
    //List的使用
    const names = ["abc", "cba", "nba"];
    // const arr = names;
    // names[0] = "hello"
    // console.log(arr);

    const namesIM = im.List(names);
    const arrIM = namesIM.set(0, "hello");
    console.log(namesIM.get(0));
    console.log(arrIM.get(0)); 
*/

    //Map只会进行浅层的转化，而from会进行深层转化，内部对象也会转化为immutable
    const info = {
      name: "zhangsan",
      age: 30,
      friend: {
        name: "lisi",
        age: 35
      }
    }
    const infoIM = im.fromJS(info);
    console.log(infoIM.get("friend"));
    console.log(infoIM.get("friend").get("name"));



  </script>
</body>
</html>